import Vue from 'vue'
import VueRouter from 'vue-router'

import Home from '@/views/Home'
import Login from '@/views/Login'
import UserList from '@/views/User/UserList.vue'
import UserAdd from '@/views/User/UserAdd.vue'
import AuthList from '@/views/Auth/AuthList.vue'
import AuthAdd from '@/views/Auth/AuthAdd.vue'
import RoleList from '@/views/Role/RoleList.vue'
import RoleAdd from '@/views/Role/RoleAdd.vue'
import RoleEdit from '@/views/Role/RoleEdit.vue'
import NotFound from '@/views/NotFound.vue'
import DishList from '@/views/Dish/DishList.vue'
import DishAdd from '@/views/Dish/DishAdd.vue'
import {getCookie} from '@/utils/cookie'
import store from '@/store'
import CatList from '@/views/Cat/CatList.vue'
import CatAdd from '@/views/Cat/CatAdd.vue'
import ExportExcel from '@/views/Excel/ExportExcel.vue'
import ImportExcel from '@/views/Excel/ImportExcel.vue'
import HomeIndex from '@/views/Home/HomeIndex.vue'
import Map1 from '@/views/Map/Map1.vue'
import Map2 from '@/views/Map/Map2.vue'

Vue.use(VueRouter) 

const routes = [
  {
    //根目录
    path: '/',
    redirect: '/home/index',
  },
  //主页 
  {
    path: '/home',
    component: Home,
    //所有页面要在home显示 配置子路由
    children:[
      {
        path:'index',
        component:HomeIndex
      },
     {
      //用户列表
      path: '/user/list',
      component: UserList
     },
     {
      //新增用户列表
      path: '/user/add',
      component: UserAdd
     },
     {
      //权限列表
      path: '/auth/list',
      component: AuthList
     },
     {
      //新增权限
      path: '/auth/add',
      component: AuthAdd
     },
     {
      //角色列表
      path: '/role/list',
      component: RoleList
     },
     {
      //新增角色
      path: '/role/add',
      component: RoleAdd
     },
     {
      //角色编辑
      path: '/role/edit/:id',
      component: RoleEdit
     },
     {
      //商品列表
      path: '/dish/list',
      component: DishList
     },
     {
      //商品添加
      path: '/dish/add',
      component: DishAdd
     },
     {
      //分类列表
      path: '/cat/list',
      component: CatList
     },
     {
      //分类添加
      path: '/cat/add',
      component: CatAdd
     },
     {
      //excel导出
      path: '/excel/exportExcel',
      component: ExportExcel
     },
     {
      //excel导入
      path: '/excel/importExcel',
      component: ImportExcel
     },
     {
      //map1
      path: '/map/map1',
      component: Map1
     },
     {
      //map2
      path: '/map/map2',
      component: Map2
     }
   ]
  },
  //登录
  {
    path: '/login',
    component: Login
  },
  {
    path: '/404',
    component: NotFound
  },
  {
    //404
    path: '*',
    redirect: '/404' 
  }
]
 
const router = new VueRouter({
  routes
})

// 该段代码不需要记，理解即可   跳转到当前地址会报错
const originalPush = VueRouter.prototype.push;
VueRouter.prototype.push = function push(location) {
    return originalPush.call(this, location).catch((err) => err);
};

//路由守卫 - 判断用户是否登录  先找cookie  门前守卫门后不守卫
//to 要跳转的 
 router.beforeEach((to,from,next) => {
  // console.log(1, getCookie('adminname'));
  //回调函数 都放行
  if(to.path === '/login' || to.path === '/404' ){
    //放行
    next()
    return
   }
   //能走到这里说明不是登录页  验证是否有cookie
    //调用getCookie获取用户名
   let adminname = getCookie('adminname')
   //判断有没有获取到
  //  console.log(222, adminname);
   //如果有cookie
   if(adminname){
    //存在 放行 
    //有cookie 设置状态
    store.commit('changeLoginStatus',true)
    // console.log(2);
    // 再看看vuex是否是登陆状态
    if(store.state.isLogin){
      // 登录成功  如果是去首页 就放行
      if(to.path === '/home'){
        next()
        return 
      }
      //验证权限
      ///将当前用户拥有的权限获取到   sessionStorage中存有
      let auths = sessionStorage.getItem('auths')
      //将所有子权限路径  -  组成一个数组  此时的auths 是字符串状态 --- 转数组
      auths = JSON.parse(auths)
      //遍历
      let arr = []
      // console.log(3);
      auths.forEach(item => {
        //item.children是一个数组中有name,path  我们只要path（所有path组成一个数组  并放在 arr中）
        //有的父权限没有子权限 加个判断  短路运算
       item.children && item.children.length && arr.push(...item.children.map(v => v.path))
      })
      // console.log(777);
      // console.log(arr);
      //判断 to.path是否在数组中
      //1.先数to.path 中有几个斜杠
      let count  = 0
      //条件成立执行下面 如果只有一个/ 就直接赋值给path
      let path = to.path
      for(let a = 0; a < to.path.length; a++){
        if(to.path[a] === '/'){
          count++
          //再判断数量是不是大于2 大于2 不要后面的只要前面的
          if(count > 2){
            path = to.path.slice(0,a)
            break
          }
        }
      }
      // console.log(888, arr,path);
      
      //判断path是否包含在数组中  直接得到布尔值
      if(arr.includes(path)) {
        // console.log(4);
        //在的话 放行
        next()
      }else{
        // console.log(5);
        //不在 拦截 去404
        router.push('/404')
        return
      }
      //为真 放行
      next()
      return 
    }else{
      //有cookie vuex 中没有数据 进行拦截
      router.push('/login')
      return
    }
   }else{
    //没有cookie  拦截
    router.push('/login')
    return
   }
 })  
export default router
